<template>
	<view class="content">
		<u-notice-bar :text="notice"></u-notice-bar>
		<u-row customStyle="margin-top: 15rpx">
			<u-col span="12">
				<uni-easyinput v-model="value" focus placeholder="请输入视频的页面地址/分享内容"></uni-easyinput>
				<u--text type="error" :text="errText" v-show="errText"></u--text>
			</u-col>
		</u-row>
		<u-row customStyle="margin-top: 15rpx">
			<u-col span="3">
				<u-button text="粘贴" color="#C0C4CC" @click="paste"></u-button>
			</u-col>
			<u-col span="3" offset="6">
				<u-button text="提交" color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" @click="submit"></u-button>
			</u-col>
		</u-row>
		<uni-card :sub-title="cardInfo.title" :title="cardInfo.author + '创作的视频'" v-show="cardInfo.show">
			<video id="video" :src="cardInfo.videoUrl" :poster="cardInfo.coverUrl" @error="videoErrorCallback" style="width: 100%; height: 230px"></video>
			<u-row customStyle="margin-top: 15rpx">
				<u-col span="3">
					<u-button text="下载封面" type="primary" @click="downloadCover"></u-button>
				</u-col>
				<u-col span="3" offset="6">
					<u-button text="下载视频" color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" @click="downloadVideo"></u-button>
				</u-col>
			</u-row>
		</uni-card>
		<u-row :customStyle="cardInfo.show ? 'margin-top: 10rpx' : 'margin-top: 700rpx'">
			<u-col span="4" offset="4">
				<u-button text="联系客服" color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" open-type="contact"></u-button>
			</u-col>
		</u-row>
	</view>
</template>

<script>
	import { parseUrl } from "@/utils/piaoUtils.js"
	export default {
		data() {
			return {
				notice: "目前支持平台: 抖音 / 皮皮虾 / 快手",
				value: "",
				errText: "",
				cardInfo: {
					show: false,
					author: '',
					title: '',
					coverUrl: '',
					videoUrl: ''
				}
			}
		},
		onLoad() {
		},
		methods: {
			/**
			 * 提交
			 */
			submit() {
				const _this = this;
				// 清空错误信息
				_this.errText = '';
				// 隐藏解析完毕窗口
				_this.cardInfo.show = false;
				if (!this.value) {
					uni.showToast({
						icon: "error",
						title: "没有可用的地址"
					})
					return;
				}
				const reg = /(https|http|ftp)\:\/\/[a-zA-Z0-9\-\.]+\.[a-zA-Z]{2,}(:[0-9]{1,5})?(\/[\S]*)?/
				const urls = this.value.match(reg);
				if (!urls) {
					uni.showToast({
						icon: "error",
						title: "没有可用的地址"
					})
					return;
				}
				uni.showLoading({
					title: "解析中，请稍后",
					mask: true
				});
				// 取第一条数据作为地址
				const url = urls[0];
				// 调用接口解析
				uni.$u.http.get('https://piao520.top/api/parse', {
					params: {
						url
					}
				}).then(res => {
					uni.hideLoading();
					if (res.data.code !== 200) {
						// 设置错误信息
						_this.errText = res.data.msg;
						return;
					}
					const data = res.data.data;
					_this.cardInfo = {
						show: true,
						title: data.title,
						author: data.author,
						coverUrl: data.cover,
						videoUrl: data.url
					}
				}).catch(error => {
					uni.hideLoading();
					console.log(error);
				})
				
			},
			/**
			 * 粘贴
			 */
			paste() {
				const _this = this;
				uni.getClipboardData({
					success: function (res) {
						_this.value = res.data;
					}
				});
			},
			videoErrorCallback(e) {
				console.log('e', e);
			},
			/**
			 * 下载封面
			 */
			downloadCover() {
				uni.showLoading({
					title: "下载中，请稍后",
					mask: true
				});
				
				const _this = this;
				//获取用户的当前设置。获取相册权限
				uni.getSetting({
					success: (res) => {
						//如果没有相册权限
						if (!res.authSetting["scope.writePhotosAlbum"]) {
							//向用户发起授权请求
							uni.authorize({
								scope: "scope.writePhotosAlbum",
								success: () => {
									uni.downloadFile({
										url: "https://piao520.top/download?url=" + _this.cardInfo.coverUrl,
										success(res) {
											uni.saveImageToPhotosAlbum({
												filePath: res.tempFilePath,
												success() {
													uni.hideLoading();
													uni.showToast({
														icon: "success",
														title: "保存成功"
													})
												},
												fail(error) {
													console.log('error', error);
													uni.hideLoading();
													if (error.errMsg == 'saveImageToPhotosAlbum:fail cancel') {
														uni.showToast({
															icon: "error",
															title: "取消保存"
														})
													} else {
														_this.errText = error.errMsg;
													}
												}
											})
										},
										fail(error) {
											console.log('error', error);
											uni.hideLoading();
											uni.showToast({
												icon: "error",
												title: "保存失败请重试"
											})
										}
									})
								},
								//授权失败
								fail: () => {
									uni.hideLoading();
									uni.showModal({
										title: "您已拒绝获取相册权限",
										content: "是否进入权限管理，调整授权？",
										success: (res) => {
											if (res.confirm) {
												//调起客户端小程序设置界面，返回用户设置的操作结果。（重新让用户授权）
												uni.openSetting({
													success: (res) => {
													console.log(res.authSetting);
													},
												});
											} else if (res.cancel) {
												return uni.showToast({
													title: "已取消！",
												});
											}
										},
									});
								},
							});
						} else {
							//如果已有相册权限，直接保存图片到系统相册
							uni.downloadFile({
								url: "https://piao520.top/download?url=" + _this.cardInfo.coverUrl,
								success(res) {
									uni.saveImageToPhotosAlbum({
										filePath: res.tempFilePath,
										success() {
											uni.hideLoading();
											uni.showToast({
												icon: "success",
												title: "保存成功"
											})
										},
										fail(error) {
											console.log('error', error);
											uni.hideLoading();
											if (error.errMsg == 'saveImageToPhotosAlbum:fail cancel') {
												uni.showToast({
													icon: "error",
													title: "取消保存"
												})
											} else {
												_this.errText = error.errMsg;
											}
										}
									})
								},
								fail(error) {
									console.log('error', error);
									uni.hideLoading();
									uni.showToast({
										icon: "error",
										title: "保存失败请重试"
									})
								}
							})
						}
					},
					fail: (res) => {},
				});
			},
			/**
			 * 下载视频
			 */
			downloadVideo() {
				uni.showLoading({
					title: "下载中，请稍后",
					mask: true
				});
				const _this = this;
				//获取用户的当前设置。获取相册权限
				uni.getSetting({
					success: (res) => {
						console.log('authSetting', res.authSetting)
						//如果没有相册权限
						if (!res.authSetting["scope.writePhotosAlbum"]) {
							console.log('发起授权')
							//向用户发起授权请求
							uni.authorize({
								scope: "scope.writePhotosAlbum",
								success: () => {
									uni.downloadFile({
										url: "https://piao520.top/download?url=" + _this.cardInfo.coverUrl,
										success(res) {
											uni.saveVideoToPhotosAlbum({
												filePath: res.tempFilePath,
												success() {
													uni.hideLoading();
													uni.showToast({
														icon: "success",
														title: "保存成功"
													})
												},
												fail(error) {
													console.log('error', error);
													uni.hideLoading();
													if (error.errMsg == 'saveVideoToPhotosAlbum:fail cancel') {
														uni.showToast({
															icon: "error",
															title: "取消保存"
														})
													} else {
														_this.errText = error.errMsg;
													}
												}
											})
										},
										fail(error) {
											console.log('error', error);
											uni.hideLoading();
											uni.showToast({
												icon: "error",
												title: "保存失败请重试"
											})
										}
									})
								},
								//授权失败
								fail: () => {
									uni.hideLoading();
									uni.showModal({
										title: "您已拒绝获取相册权限",
										content: "是否进入权限管理，调整授权？",
										success: (res) => {
											if (res.confirm) {
												//调起客户端小程序设置界面，返回用户设置的操作结果。（重新让用户授权）
												uni.openSetting({
													success: (res) => {
													console.log(res.authSetting);
													},
												});
											} else if (res.cancel) {
												return uni.showToast({
													title: "已取消！",
												});
											}
										},
									});
								},
							});
						} else {
							//如果已有相册权限，直接保存视频到系统相册
							uni.downloadFile({
								url: "https://piao520.top/download?url=" + _this.cardInfo.videoUrl,
								timeout: 600000,
								success(res) {
									uni.saveVideoToPhotosAlbum({
										filePath: res.tempFilePath,
										success() {
											uni.hideLoading();
											uni.showToast({
												icon: "success",
												title: "保存成功"
											})
										},
										fail(error) {
											console.log('error', error);
											uni.hideLoading();
											if (error.errMsg == 'saveVideoToPhotosAlbum:fail cancel') {
												uni.showToast({
													icon: "error",
													title: "取消保存"
												})
											} else {
												_this.errText = error.errMsg;
											}
										}
									})
								},
								fail(error) {
									console.log('error', error);
									uni.hideLoading();
									uni.showToast({
										icon: "error",
										title: "保存失败请重试"
									})
								}
							})
						}
					},
					fail: (res) => {},
				});
			}
		}
	}
</script>

<style>
	.content {
		padding: 10rpx;
	}
</style>
